import 'dart:ui';

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:kkhousekeep/page/home/convenient/visitor/record_add_controller.dart';
import 'package:kkhousekeep/widget/custom_button.dart';
import 'package:kkhousekeep/widget/form_widget.dart';

import '../../../../widget/custom_app_bar.dart';

class BuildVisitorPassPage extends StatelessWidget {
  const BuildVisitorPassPage({super.key});

  @override
  Widget build(BuildContext context) {
    return GetBuilder(
      init: VisitorPassPageController(),
      builder: (controller) => Stack(
        children: [
          Container(
            decoration: const BoxDecoration(
                image: DecorationImage(
                    image: AssetImage("assets/images/page_bg.png"),
                    fit: BoxFit.fill)),
            child: Scaffold(
              backgroundColor: Colors.transparent,
              body: GestureDetector(
                behavior: HitTestBehavior.opaque,
                onTap: () => FocusManager.instance.primaryFocus?.unfocus(),
                child: SingleChildScrollView(
                  child: _builderBodyWidget(controller),
                ),
              ),
            ),
          ),
          Positioned(
              left: 166.w, bottom: 102.h, child: _buildButton(controller)),
        ],
      ),
    );
  }

  Widget _builderBodyWidget(VisitorPassPageController controller) {
    return Column(
      children: [
        _buildTitle(),
        _buildTopForm(controller),
        SizedBox(
          height: 16.h,
        ),
        _buildBottomForm(controller)
      ],
    );
  }

  Widget _buildTopForm(VisitorPassPageController controller) {
    return Container(
      width: 686.w,
      padding: EdgeInsets.only(left: 24.w, right: 24.w),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.all(Radius.circular(16.w)),
        color: Colors.white,
      ),
      child: Column(
        children: [
          FormWidget.edit(
            labelText: "访客姓名",
            hintText: "请输入访客姓名",
            onChange: (content) => controller.updateName(content),
          ),
          FormWidget.edit(
            labelText: "访客电话",
            hintText: "请输入访客手机号码",
            keyboardType: TextInputType.number,
            inputFormatters: [
              FilteringTextInputFormatter.digitsOnly,
              LengthLimitingTextInputFormatter(11)
            ],
            onChange: (content) => controller.updatePhone(content),
          ),
          Obx(
            () => FormWidget.text(
                labelText: "访客地址", text: controller.arriveAddress.value),
          ),
          FormWidget.edit(
            labelText: "来访人数",
            hintText: "请输入访客数量",
            keyboardType: TextInputType.number,
            inputFormatters: [FilteringTextInputFormatter.digitsOnly],
            onChange: (content) => controller.updateCount(content),
          ),
          FormWidget.edit(
            labelText: "车牌号码",
            hintText: "请输入车牌号码（选填）",
            onChange: (content) => controller.updateLicensePlate(content),
          )
        ],
      ),
    );
  }

  Widget _buildBottomForm(VisitorPassPageController controller) {
    return Container(
      width: 686.w,
      height: 500.h,
      padding: EdgeInsets.only(left: 24.w, right: 24.w),
      decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(16.w), color: Colors.white),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Obx(
            () => FormWidget.customSelect(
              labelText: "到访时间",
              selectText: controller.startTime.value,
              onSelectClick: () =>
                  controller.buildTimePickWidget(isArrive: true),
            ),
          ),
          Obx(
            () => FormWidget.customSelect(
              labelText: "离开时间",
              selectText: controller.endTime.value,
              onSelectClick: () =>
                  controller.buildTimePickWidget(isArrive: false),
            ),
          ),
          SizedBox(
            height: 25.h,
          ),
          Text(
            "来访目的",
            style: TextStyle(fontSize: 32.sp, color: const Color(0xFF6D6D6D)),
          ),
          SizedBox(
            width: 622.w,
            height: 230.h,
            child: TextField(
              onChanged: (content) => controller.updatePurpose(content),
              decoration: InputDecoration(
                border: InputBorder.none,
                hintText: "你的描述便于门岗人员快速核对（选填）",
                hintStyle:
                    TextStyle(fontSize: 32.sp, color: const Color(0xFF999999)),
              ),
              style: TextStyle(fontSize: 32.sp),
              maxLength: 50,
              maxLines: 2,
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildButton(VisitorPassPageController controller) {
    VisitorPassPageController controller =
        Get.find<VisitorPassPageController>();
    return Obx(
      () => CustomButton(
        text: "提交申请",
        width: 420.w,
        height: 90.h,
        isAsh: controller.isAsh.value,
        onPressed: () => controller.submitVisitorInformation(),
      ),
    );
  }

  Widget _buildTitle() {
    var appBar = CustomAppBar("", backgroundColor: Colors.transparent);
    var statusBarHeight = MediaQueryData.fromWindow(window).padding.top;
    return ClipRect(
      child: SizedBox(
        height: 202.h + statusBarHeight,
        child: Padding(
          padding: EdgeInsets.only(left: 0.w),
          child: Row(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  SizedBox(height: 56.h),
                  InkWell(
                    child: appBar.leading,
                  ),
                  Padding(
                    padding: EdgeInsets.only(left: 56.w),
                    child: Text(
                      "填写访客申请",
                      style: TextStyle(
                        fontSize: 40.sp,
                        color: const Color(0XFF333333),
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                  ),
                ],
              ),
              SizedBox(
                width: 108.w,
              ),
              Padding(
                padding: EdgeInsets.only(top: statusBarHeight),
                child: Image.asset(
                  "assets/images/home_visitor_record_icon.png",
                  width: 318.w,
                  height: 266.h,
                  fit: BoxFit.cover,
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}
